import { defineConfig, loadEnv } from "vite";
import vue from "@vitejs/plugin-vue";
import autoprefixer from "autoprefixer"
import path from "path"; //这个path用到了上面安装的@types/node
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
import { fileURLToPath, URL } from "node:url"
import Icons from "unplugin-icons/vite";
import IconsResolver from "unplugin-icons/resolver";
// import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
// import { PROXY_URL } from "./src/config";
import { wrapperEnv } from "./build/getEnv"
import { createProxy } from "./build/proxy"

const pathSrc = path.resolve(__dirname, "src");
// https://vitejs.dev/config/
export default defineConfig(({ mode }) => {
  const env = loadEnv(mode, process.cwd())
  const viteEnv = wrapperEnv(env)
  return {
    base: viteEnv.VITE_PUBLIC_PATH,

    plugins: [
      vue(),
      AutoImport({
        imports: [
          "vue",
          "vue-router",
          "pinia",
          {
            axios: [
              ["default", "axios"], // import { default as axios } from "axios",
            ],
            // "lodash": [
            //   // 配置哪些方法自动引入
            //   "concat", // 相对于 import { concat } from "lodash"
            //   ["compact", "cp"], // 相对于 import { compact as cp } from "lodash"
            // ],
          },
        ],
        // 配置哪些本地目录支持自动引入
        dirs: [
          "./src/utils/**",
          "./src/api",
          "./src/stores",
          "./src/routers",
          // "./src/hooks",
        ],
        eslintrc: {
          enabled: true, // 是否自动生成 eslint 规则，建议生成之后设置 false
          filepath: "./.eslintrc-auto-import.json", // 指定自动导入函数 eslint 规则的文件
        },
        resolvers: [ElementPlusResolver(), IconsResolver({}),],
      }),
      Components({
        resolvers: [ElementPlusResolver(), IconsResolver()],
        // 配置本地组件库的自动引入
        dts: path.resolve(pathSrc, "types", "components.d.ts"), // 指定自动导入组件TS类型声明文件路径位置，默认根目录
        dirs: ["./src/components"],
        vueTemplate: true, // 是否在 vue 模板中自动导入
      }),
      Icons({
        // 自动安装图标库
        autoInstall: true,
      }),
    ],
    css: {
      postcss: {
        plugins: [
          autoprefixer({
            overrideBrowserslist: ["Android 4.1", "iOS 7.1", "Chrome > 31", "ff > 31", "> 1%"],
            grid: true,
          }),
        ],
      },
    },
    esbuild: {
      // 打包时删除所有 console.log 和 debugger 语句
      pure: viteEnv.VITE_DROP_CONSOLE ? ["console.log", "debugger"] : [],
    },
    resolve: {
      alias: {
        "@": fileURLToPath(new URL("./src", import.meta.url)),
      },
      extensions: [".js", ".json", ".ts"], // 使用路径别名时想要省略的后缀名，可以自己 增减
    },
    define: {
      __APP_VERSION__: JSON.stringify(process.env.npm_package_version),
      __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: true,
    },
    server: {
      host: true, // 监听所有地址，包括局域网和公网地址
      https: false,
      port: viteEnv.VITE_PORT,
      open: viteEnv.VITE_OPEN,
      proxy: createProxy(viteEnv.VITE_PROXY),
      //解决跨域
      // proxy: {
      //   "/api": {
      //     target: "http://localhost:3000",
      //     changeOrigin: true,
      //     rewrite: (path) => path.replace(/^\/api/, ""),
      //   }
      // }
    },
    build: {
      chunkSizeWarningLimit: 2000,
      reportCompressedSize: false,
    },
    optimizeDeps: {
      include: [
        `monaco-editor/esm/vs/language/json/json.worker`,
        `monaco-editor/esm/vs/language/css/css.worker`,
        `monaco-editor/esm/vs/language/html/html.worker`,
        `monaco-editor/esm/vs/language/typescript/ts.worker`,
        `monaco-editor/esm/vs/editor/editor.worker`,
      ],
    },
  }

});
